<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        body {
            height: 2000px;
        }
    </style>
</head>

<body>
    <p>事件在冒泡阶段触发：2、1、0 事件在捕获阶段触发：0、1、2。 由于事件传播的机制，使得同一个事件会多次触发。 在捕获阶段依次为：window -> document -> html -> body -> div -> section -> p 在冒泡阶段依次为：p -> section -> div -> body -> html -> document -> window 如果你需要阻止事件传播可通过如下方式： event.stopPropagation()：阻止事件传播（只会阻止当前监听函数的传播）
        event.stopImmediatePropagation()：阻止事件传播（阻止所有监听函数）
    </p>
    <script>
        // onscroll = function(e) {
        //     console.log(e)
        //     console.log('滚动条触发呢')
        // }
        window.addEventListener('scroll', function(e) {
            // console.log(e)
            // console.log(window.scrollY);
            console.log(window.scrollY)
            console.log(window.s)
        })
        window.addEventListener('resize', function(e) {
            // console.log(e)
            console.log(window.innerHeight)
            console.log('窗口大小发生呢变化')
        })
    </script>
</body>

</html>